import { Component, OnInit, Input, OnChanges } from '@angular/core';
import { OneMapService } from '../one-map.service';
import { DatePipe } from '@angular/common';
import { UtilService } from 'src/app/core/util/util.service';

@Component({
  selector: 'app-monitor-pump',
  templateUrl: './monitor-pump.component.html',
  styleUrls: ['./monitor-pump.component.scss']
})
export class MonitorPumpComponent implements OnChanges {
  @Input() data: any;
  beginDate: Date = new Date(+new Date() - 7 * 24 * 60 * 60 * 1000);
  endDate: Date = new Date();
  tabs: any[] = ["过程线"];
  activeIdx: number = 0;
  processOpt: any = {
    tooltip: {
      trigger: "axis",
      axisPointer: {
        type: "cross",
        animation: false,
        label: {
          backgroundColor: "#505765"
        }
      }
    },
    legend: {
      data: ["流量"],
      bottom: 10
    },
    xAxis: {
      type: "category",
      data: []
    },
    yAxis: [
      {
        name: "流量(m³/s)",
        type: "value"
      }
    ],
    series: [
      {
        name: "流量",
        type: "line",
        smooth: true,
        data: []
      }
    ]
  };
  processOptChange: any = {};

  constructor(private mapService: OneMapService, private datePipe: DatePipe, private util: UtilService) { }

  ngOnChanges(): void {
    console.log('------------------pump: ');
    // console.log(this.data);
    this.onQueryProcessList();
  }

  onChange(dates) {
    this.beginDate = dates[0];
    this.endDate = dates[1];
  }

  onSelectChange(e) {
    this.activeIdx = e.index;
    this.onQueryProcessList();
  }

  onQueryProcessList() {
    this.mapService.queryProcessPump({
      pumpCode: this.data.pumpCode,
      beginTime: this.datePipe.transform(this.beginDate, "yyyy-MM-dd"),
      endTime: this.datePipe.transform(this.endDate, "yyyy-MM-dd")
    }).subscribe(list => {
      this.processOptChange = {
        xAxis: [
          {
            data: this.util.getItemValues(list, "runtime")
          }
        ],
        series: [
          {
            data: this.util.getItemValues(list, "instanFlow")
          }
        ]
      };
    });
  }
}
